<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>邀请注册</title>
    <script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.js"></script>
</head>
<body class="container">
    <section>
        <p>邀请注册界面</p>
        <div>
            手机号：<input type="text" value="" name="user_phone" id="user_phone"/><br/>
            验证码：<input type="text" value="" name="user_verify_code" id="user_verify_code"/> &nbsp; &nbsp; <input type="button" value="获取验证码" id="getVerifyCodeBtn" onclick="getVerifyCode();"/><br/>
            用户名：<input type="text" value="" name="user_nick_name" id="user_nick_name"/><br/>
            密  码：<input type="text" value="" name="user_password" id="user_password"/><br/>
            <input type="hidden" th:value="${invite_token}" id="invite_token"/><br/>
            <input type="button" value="完成注册" id="doneRegister" onclick="doRegister();"/>
        </div>
    </section>
    
<script >
    //完成注册
    function doRegister()
    {
        var userPhone = $("#user_phone").val();
        var userNickName = $("#user_nick_name").val();
        var userVerifyCode = $("#user_verify_code").val();
        var userPassword = $("#user_password").val();
        var inviteToken = $("#invite_token").val();
        
        if(!(/^1[3456789]\d{9}$/.test(userPhone))){
            alert("手机号码有误，请重填");
            return ;
        }
        //校验手机号是否已经占用
        var result = true;
        $.ajax(
        {
            type : "GET",
            url : "/v1/user/findPhoneExist?phone=" + userPhone,
            contentType:"application/json",
            dataType: "JSON",
            async : false,
            data : {},
            success : function(res)
            {
                if(res.code == 300)
                {
                    alert("手机号被占用, 请换号码重试!");
                    result = false;
                }
            },
            error: function(res) {
                alert("服务器通信错误, 请稍后再试!");
                result = false;
            }
        });
        if(!result)
        {
            return result;
        }
        
        var userModel = 
            {
                userPhone : userPhone,
                userNickName : userNickName, 
                userVerifyCode : userVerifyCode,
                userPassword : userPassword,
                inviteToken : inviteToken
            };
        
        $.ajax(
        {
            type : "POST", 
            url : "/invite/doRegister", 
            contentType:"application/json", 
            dataType: "JSON", 
            async : false, 
            data : JSON.stringify(userModel),
            success : function(res)
            {
                if(res.code == 200)
                {
                    alert("注册成功!");
                }else
                {
                    alert("验证码不合法或已过期.");
                }
            },
            error: function(res) {
                alert("服务器通信错误, 请稍后再试!");
            }
        });
    }
    //获取验证码
    function getVerifyCode()
    {
        var phone = $("#user_phone").val();
        //手机号格式
        if(!(/^1[345789]\d{9}$/.test(phone)))
        {
            alert("手机号码格式不正确, 请重新输入!");
            return false;
        }
        //校验手机号是否已经占用
        var result = true;
        $.ajax(
        {
            type : "GET",
            url : "/v1/user/findPhoneExist?phone=" + phone,
            contentType:"application/json",
            dataType: "JSON",
            async : false,
            data : {},
            success : function(res)
            {
                if(res.code == 300)
                {
                    alert("手机号被占用, 请换号码重试!");
                    result = false;
                }
            },
            error: function(res) {
                alert("服务器通信错误, 请稍后再试!");
                result = false;
            }
        });
        if(!result)
        {
            return result;
        }
        
        //获取验证码
        $.ajax(
        {
            type : "GET",
            url : "/v1/tools/sendSMS?phone=" + phone,
            contentType:"application/json",
            dataType: "JSON",
            async : false,
            data : {},
            success : function(res)
            {
                if(res.code == 200)
                {
                    alert("验证码已发送您的手机!");
                }else
                {
                    alert("验证码获取异常, 请联系管理员!");
                }
            },
            error: function(res) {
                alert("服务器通信错误, 请稍后再试!");
            }
        });
    }
</script>
</body>
</html>